<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        //  console.log(fn1());
        //  function fn1(){
        //     return 666
        //  }

        //  console.log(fn1());


        // console.log(fn2());//fn2 is not a function
        // var fn2 = function(){
        //     return 888
        // }
        // console.log(fn2());



         console.log(fn1());
         function fn1(){
            return 666
         }

         console.log(fn1());

         // 打开浏览器 读取下面的
         // console.log(fn1());
        //  function fn1(){
        //     return 666
        //  }

        //  console.log(fn1());

        // 开始预解析  
        // 第一行 不预解析  
        // 第二行  声明一个变量 名字叫fn1 并且给这个变量赋值一个函数 
        // 第三行  不预解析  



        // 预解析结束  

        // 存在fn1这个变量 变量里边是个函数  '
        
        // 函数执行   
        // console.log(fn1()); 
        // 因为 fn1是个函数 正常调用  然后拿到返回值 输出到控制台  

        // fn1()调用 fn1内的代码预解析   fn1中return 666 不予解析  
        // 直接执行   


        //第三行  正常调用  
    



        console.log(fn2());//fn2 is not a function
        var fn2 = function(){
            return 888
        }
        console.log(fn2());


        // 第一步 不预解析 

        // 第二行  预解析
        // 声明变量 fn2 不赋值 
        // 第三行  不预解析 


        // 预解析结束  
        // 存在fn2这个变量  里边是 undefined  


        // 执行的时候  
        //console.log(fn2()); 把fn2 当做一个函数调用 
        // 但是预解析完成 fn2 仅仅是个变量 里边是undefined 
        // 所以报错  fn2 is not a function 


        // 第二步  把一个函数赋值给 fn2 
        // 这时候fn2是个函数    

        // 第3步 正常调用  
    </script>
</body>

</html>